import Vue from 'vue'
import Router from 'vue-router'
import Login from '@/components/Login'
import Home from '@/pages/Home'

Vue.use(Router)

let router = new Router({
 // mode:'history',
  routes: [
    {
      path:'/login',
      name:Login,
      component:Login,
      meta: {
        title: '登录'
      }
    },
    {
      path:'/home',
      name:Home,
      component:Home,
      meta:{
        title:'首页'
      }
    }
  ]
})
router.beforeEach((to, from, next) => {
  // console.log('to:' + to.path)
  if (to.path.startsWith('/login')) {
    window.localStorage.removeItem('access-token')
    next()
  } else if (to.path.startsWith('/')) {
    next({path: '/login'})
  } else {
    //let user = JSON.parse(window.localStorage.getItem('access-token'))
    let user = window.localStorage.getItem('access-token');
    if (!user) {
      next({path: '/login'})
    } else {
      next()
    }
  }
})


//暴露router
export default router


// 需要左方向动画的路由用this.$router.to('****')
Router.prototype.togo = function (path) {
  this.isleft = true
  this.isright = false
  this.push(path)
}
// 需要右方向动画的路由用this.$router.goRight('****')
Router.prototype.goRight = function (path) {
  this.isright = true
  this.isleft = false
  this.push(path)
}
// 需要返回按钮动画的路由用this.$router.goBack()，返回上一个路由
Router.prototype.goBack = function () {
  this.isright = true
  this.isleft = false
  this.go(-1)
}
// 点击浏览器返回按钮执行，此时不需要路由回退
Router.prototype.togoback = function () {
  this.isright = true
  this.isleft = false
}
// 点击浏览器前进按钮执行
Router.prototype.togoin = function () {
  this.isright = false
  this.isleft = true
}

//上述执行路由跳转时,在APP.vue中判断滑动的方向来指定动画的方向,不需要动画的话,直接使用this.$router.push('****'),来进行跳转路由,可以转到App.vue中查看动画的跳转配置
// this.$router.goBack()   // 组件中返回的用法
// this.$router.to('****')  // 组件中进入到详情的用法
